<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>QQT Interface Testing</title>
<link rel="stylesheet" type="text/css" href="css/qqtStyles.css">
</head>
<body>
<div class="content">
<div class="left">
	<fieldset class="request">
	    <legend>Request</legend>
		<textarea id="request"></textarea>
		<button id="post" class="button">POST</button>
		<button id="copyRequest" class="button" onclick="copyToClipboard()">COPY</button>
		<button id="showWebsites" class="button" onclick="showWebsites()">Show Websites</button>
		<button id="showWebsites" class="button" onclick="automation()">Automation</button>
	</fieldset>

	<fieldset class="interfaces">
		<legend>Interfaces</legend>
		<div id="interfacesContainer" class="interfacesContainer">
			<div id="testingParameters" class="testingParameters">
				<table id="ParametersTable" class="hovertable">
					<tbody>
					<tr>
						<td><lable for="">Type:</lable></td>
						<td>
							<select id="types" onchange="document.getElementById('type').value=this.value;" style="width:285px;">
							</select>
							<input class="editableSelectInput" id="type" type="text" style="width:260px;margin-left:-289px;"/>
							<button class="button" onclick="loadType()">Load</button><input type="checkbox" id="error" >Error
						</td>
					</tr>
					<tr>
						<td><lable for="testingURL">URL:</lable></td>
						<td>
							<select id="testingURLs" onchange="document.getElementById('testingURL').value=this.value;" style="width:485px;">
							</select>
							<input class="editableSelectInput" id="testingURL" type="text" style="width:460px;margin-left:-489px;"/>
						</td>
					</tr>
					<tr>
						<td><lable for="father_mobile">Father Mobile:</lable></td>
						<td>
							<select id="father_mobiles" onchange="document.getElementById('father_mobile').value=this.value">
							</select>
							<input class="editableSelectInput" id="father_mobile" type="text" />
							<button class="button" onclick="changeFatherMobile()">changeFatherMobile</button>
						</td>
					</tr>
					<tr>
						<td><lable for="child_mobile">Child Mobile:</lable></td>
						<td>
							<select id="child_mobiles" onchange="document.getElementById('child_mobile').value=this.value">
							</select>
							<input class="editableSelectInput" id="child_mobile" type="text" />
							<button class="button" onclick="changeChildMobile()">changeChildMobile</button>
						</td>
					</tr>
					<tr>
						<td><lable for="password">Password:</lable></td>
						<td>
							<select id="passwords" onchange="document.getElementById('password').value=this.value">
								<option>--Password--</option>
							</select>
							<input class="editableSelectInput" id="password" type="text" />
							<button class="button" onclick="changePassword()">changePassword</button>
						</td>
					</tr>
					<tr>
						<td><lable for="sessionid">Session ID:</lable></td>
						<td>							
							<input class="textbox" id="sessionid" type="text" style="width:64%;"/>
							<button class="button" onclick="changeSession()">changeSessionID</button><br>
						</td>
					</tr>
					</tbody>
				</table>
			</div>
			<div id="interfaces"></div>
			<!--interfaces added here-->
		</div>
	</fieldset>
	
</div><!--Left end-->

<div class="middle">
	<div id="loadingDiv" class="loading"></div>
	<div id="websites" class="websites" style="display:none;"></div>
</div><!--Middle end-->

<div class="right">
	<fieldset class="response">
		<legend>Response</legend>
		<textarea id="response" readonly="readonly"></textarea>
	</fieldset>
	<fieldset class="history">
		<legend>History</legend>
		<table class="hovertable" style="width:97.26%;">
			<thead>
				<tr>
					<th>Action Code</th>
					<th>Action Name</th>
					<th>Request</th>
					<th>Response</th>
					<th>Request Time</th>
					<th>Elapsed Time</th>
					<th>Result</th>
				</tr>
			</thead>
		</table>
		<div class="historyContainer">
			<table id="history" class="hovertable">
				<tbody>
				</tbody>
			</table>
		</div>
		<lable for="logFileName">Log File:</lable>
		<input class="logFileName" id="logFileName" type="text"/>
		<button id="saveLog" class="button" onclick="saveHistory()">Save</button>
		<button id="openLog" class="button" onclick="readLog()">Open</button>
		<button id="clearLog" class="button" onclick="clearLog()">Clear</button>
	</fieldset>
</div><!--Right end-->

<script type="text/javascript" src="js/qqtInterface.js"></script>

</body>
</html>
